<nav class="nav navbar-default navbar-static-top">
    <div class="container">
        <div class="navbar-header">
            <!-- Collapsed Hamburger -->

            <a class="navbar-brand" href="{{url('/')}}">
                三刷
            </a>
        </div>
        <div class="collapse navbar-collapse" id="app-navbar-collapse">
            <!--left-->
            <!-- Left Side Of Navbar -->
            <ul class="nav navbar-nav">
                <li class="{{active_class(if_route('topics.index'))}}"><a href="{{ route('topics.index') }}">话题</a></li>
                <li class="{{active_class((if_route('categories.show') && if_route_param('category',1)))}}"><a href="{{ route('categories.show', 1) }}">分享</a></li>
                <li class="{{active_class((if_route('categories.show') && if_route_param('category',2)))}}"><a href="{{ route('categories.show', 2) }}">教程</a></li>
                <li class="{{active_class((if_route('categories.show') && if_route_param('category',3)))}}"><a href="{{ route('categories.show', 3) }}">问答</a></li>
                <li class="{{active_class((if_route('categories.show') && if_route_param('category',4)))}}"><a href="{{ route('categories.show', 4) }}">公告</a></li>
            </ul>
            <!--right-->
            <ul class="nav navbar-nav navbar-right">
                @guest
                <li><a href="{{route('login')}}">login</a></li>
                <li><a href="{{route('register')}}">register</a></li>
                @else
                    <li>
                        <a href="{{ route('topics.create') }}">
                            <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
                        </a>
                    </li>
                {{--消息通知 --}}
                <li>
                    <a href="{{route('notifications.index')}}" class="notifications-badge" style="margin-top: -2px;">
                        <span class="badge badge-{{ Auth::user()->notification_count > 0 ? 'hint' : 'fade' }} " title="消息提醒">
                                {{ Auth::user()->notification_count }}
                            </span>
                    </a>
                </li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                        <span class="user-avatar pull-left" style="margin-right:8px; margin-top:-5px;">
                                <img src="{{Auth::user()->avatar}}" class="img-responsive img-circle" width="30px" height="30px">
                            </span>
                        {{Auth::user()->name}}<span class="target"></span>

                    </a>

                    <ul class="dropdown-menu" role="menu">
                        @can('manage_contents')
                            <li>
                                <a href="{{ url(config('administrator.uri')) }}">
                                    <span class="glyphicon glyphicon-dashboard" aria-hidden="true"></span>
                                    管理后台
                                </a>
                            </li>
                        @endcan
                        <li>
                            <a href="{{route('users.show',Auth::user()->id)}}">
                                个人中心
                            </a>
                        </li>
                        <li>
                            <a href="{{route('users.edit',Auth::user()->id)}}">
                                编辑资料
                            </a>
                        </li>
                        <li>
                            <a href="{{ route('logout') }}"
                               onclick="event.preventDefault();
                                             document.getElementById('logout-form').submit();">
                                退出登录
                            </a>
                            <form id="logout-form" action="{{route('logout')}}" method="post" style="display: none">
                                {{csrf_field()}}
                            </form>
                        </li>
                    </ul>
                </li>
                    @endguest
            </ul>
        </div>

    </div>
</nav>